<template>
  <div class="printForm">
    <div class="area-header">
      <span class="area-header-title">{{ $t('申请单') }}</span>
    </div>
    <table class="printTable">
      <tr>
        <td class="tit">{{ $t('申请标题') }}</td>
        <td colspan="3">{{ form.actTitle }}</td>
      </tr>
      <tr v-if="!$route.query.id">
        <td class="tit">{{ $t('项目名称') }}</td>
        <td colspan="3">
          <DealSelect
            v-model="form.dealId"
            deal-status="TH"
            deal-type="equity"
            :is-echo="true"
          />
        </td>
      </tr>
      <tr>
        <td class="tit">{{ $t('注册资本') + $t('(万)') + '/' + $t('总股数') + $t('(万股)') }}</td>
        <td>{{ moneyFormat(form.registeredCapita, 'w') }}</td>
        <td class="tit">{{ $t('币种') }}</td>
        <td>{{ selectDictLabel(currencyOptions, form.currency) }}</td>
      </tr>
      <tr>
        <td class="tit">{{ $t('退出状态') }}</td>
        <td>
          <dictSelect
            v-model="form.quitStatus"
            :is-echo="true"
            dictionary="quit_status"
          />
        </td>
        <td class="tit">{{ $t('回款类型') }}</td>
        <td>{{ selectDictLabel(distributionTypeOptions, form.distributionType) }}</td>
      </tr>
      <tr>
        <td class="tit">{{ $t('权益变更时间') }}</td>
        <td>{{ parseTime(form.distributionDate) }}</td>
        <td class="tit">{{ $t('相关退出决策') }}</td>
        <td>
          <el-select v-model="form.joinExit" filterable>
            <el-option
              v-for="exit in exitList"
              :key="exit.id"
              :label="exitModeFormat(exit) + ' - ' + parseTime(exit.draftExitTime)"
              :value="exit.id"
            />
          </el-select>
        </td>
      </tr>
      <tr>
        <td class="tit">{{ $t('相关合同') }}</td>
        <td>
          {{ form.relatedContracts }}
        </td>
        <td class="tit">{{ $t('本金') }}{{ $t('金额单位') }}</td>
        <td>
          {{ moneyFormat(form.amountPrincipal, 'w') }}
        </td>
      </tr>
      <tr>
        <td class="tit">{{ $t('收益') }}{{ $t('金额单位') }}</td>
        <td>
          {{ moneyFormat(form.amountIncome, 'w') }}
        </td>
        <td class="tit">{{ $t('分红') }}{{ $t('金额单位') }}</td>
        <td>
          {{ moneyFormat(form.amountBonus, 'w') }}
        </td>
      </tr>
      <tr>
        <td class="tit">{{ $t('其它') }}{{ $t('金额单位') }}</td>
        <td>
          {{ moneyFormat(form.amountOthers, 'w') }}
        </td>
        <td class="tit">{{ $t('回款总额') }}{{ $t('金额单位') }}</td>
        <td>
          {{ moneyFormat(form.amountDistribution, 'w') }}
        </td>
      </tr>
      <tr>
        <td class="tit">{{ $t('回款后持股数量') + $t('(万股)') }}</td>
        <td>
          {{ moneyFormat(form.numberOfShares, 'w') }}
        </td>
        <td class="tit">{{ $t('回款后持股比例(%)') }}</td>
        <td>
          {{ form.exitShareRatio }}
        </td>
      </tr>
    </table>

    <div v-if="form.dealDistributionDetailsList && form.dealDistributionDetailsList.length > 0">
      <div class="area-header">
        <span class="area-header-title">{{ $t('收益主体列表') }}</span>
      </div>
      <table class="previewTable">
        <thead>
          <th>{{ $t('主体名称') }}</th>
          <th>{{ $t('回款总额') + $t('金额单位') }}</th>
          <th>{{ $t('退出前股数') + $t('(万股)') }}</th>
          <th>{{ $t('退出股数') + $t('(万股)') }}</th>
          <th>{{ $t('退出后持股数量') + $t('(万股)') }}</th>
          <th>{{ $t('退出后持股比例(%)') }}</th>
        </thead>
        <tbody>
          <tr v-for="(v, ind) in form.dealDistributionDetailsList" :key="ind">
            <td>{{ v.investorName }}</td>
            <td>{{ moneyFormat(v.amountDistribution, 'w') }}</td>
            <td>{{ moneyFormat(v.numberOfSharesBeforeExit, 'w') }}</td>
            <td>{{ moneyFormat(v.withdrawalOfShareCapital, 'w') }}</td>
            <td>{{ moneyFormat(v.numberOfShares, 'w') }}</td>
            <td>{{ v.exitShareRatio }}</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div v-if="form.dealDistributionDetailsSubList && form.dealDistributionDetailsSubList.length > 0">
      <div class="area-header">
        <span class="area-header-title">{{ $t('回款明细') }}</span>
      </div>
      <table class="previewTable">
        <thead>
          <th>{{ $t('主体名称') }}</th>
          <th>{{ $t('回款时间') }}</th>
          <th>{{ $t('本金') + $t('金额单位') }}</th>
          <th>{{ $t('收益') + $t('金额单位') }}</th>
          <th>{{ $t('分红') + $t('金额单位') }}</th>
          <th>{{ $t('其它') + $t('金额单位') }}</th>
          <th>{{ $t('回款总额') + $t('金额单位') }}</th>
          <th>{{ $t('备注') }}</th>
        </thead>
        <tbody>
          <tr v-for="(v, ind) in form.dealDistributionDetailsSubList" :key="ind">
            <td>{{ v.investorName }}</td>
            <td>{{ parseTime(v.collectionTime) }}</td>
            <td>{{ moneyFormat(v.amountPrincipal, 'w') }}</td>
            <td>{{ moneyFormat(v.amountIncome, 'w') }}</td>
            <td>{{ moneyFormat(v.amountBonus, 'w') }}</td>
            <td>{{ moneyFormat(v.amountOthers, 'w') }}</td>
            <td>{{ moneyFormat(v.amountDistribution, 'w') }}</td>
            <td>{{ v.payeeName }}</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div v-show="form.actStatus === 'W'" v-if="form.dealDistributionPaymentList && form.dealDistributionPaymentList.length > 0">
      <div class="area-header">
        <span class="area-header-title">{{ $t('实际回款明细') }}</span>
      </div>
      <table class="previewTable">
        <thead>
          <th>{{ $t('主体名称') }}</th>
          <th>{{ $t('回款时间') }}</th>
          <th>{{ $t('本金') + $t('金额单位') }}</th>
          <th>{{ $t('收益') + $t('金额单位') }}</th>
          <th>{{ $t('分红') + $t('金额单位') }}</th>
          <th>{{ $t('其它') + $t('金额单位') }}</th>
          <th>{{ $t('备注') }}</th>
        </thead>
        <tbody>
          <tr v-for="(v, ind) in form.dealDistributionPaymentList" :key="ind">
            <td>{{ v.investorName }}</td>
            <td>{{ parseTime(v.collectionTime) }}</td>
            <td>{{ moneyFormat(v.amountPrincipal, 'w') }}</td>
            <td>{{ moneyFormat(v.amountIncome, 'w') }}</td>
            <td>{{ moneyFormat(v.amountBonus, 'w') }}</td>
            <td>{{ moneyFormat(v.amountOthers, 'w') }}</td>
            <td>{{ v.payeeName }}</td>
          </tr>
        </tbody>
      </table>
    </div>
    <!-- 附件列表 -->
    <FileView :list.sync="form.fileList" data-type="deal_distribution" :business-id="autoBusinessId($route.query.id, form)" :btn-show="!otherBtnHide" />

  </div>
</template>

<script>
    import { getDealDistribution, getInvestment, getDistributionDetails } from '@/api/deal/distribution/dealDistribution'
    import { listDealExit } from '@/api/deal/exit/dealExit'

    export default {
        data() {
            return {
                // 是否隐藏保存按钮
                btnHide: false,
                // 是否隐藏其他按钮
                otherBtnHide: false,
                // 回款类型字典
                distributionTypeOptions: [],
                // 币种字典
                currencyOptions: [],
                // 退出方式字典
                exitModeOptions: [],
                form: {
                  dealDistributionDetailsList: [],
                  // 附件列表
                  fileList: []
                },
                // 关联退出列表
                exitList: [],
                isShowJoinExit: false,

                // 遮罩层
                loading: false,
                // 操作按钮默认不展示
                buttonShow: true
                // unwatch: undefined
            }
        },
        watch: {
          // 侦听收益主体列表数据
          'form.dealDistributionDetailsList': {
            handler(val) {
              this.form.amountPrincipal = 0
              this.form.amountIncome = 0
              this.form.amountOthers = 0
              this.form.amountBonus = 0
              this.form.amountDistribution = 0
              this.form.exitShareRatio = 0
              if (val != null) {
                val.forEach((e) => {
                  e.amountDistribution = Number(e.amountPrincipal) + Number(e.amountIncome) + Number(e.amountOthers)
                  this.form.amountPrincipal += Number(e.amountPrincipal)
                  this.form.amountIncome += Number(e.amountIncome)
                  this.form.amountOthers += Number(e.amountOthers)
                  this.form.amountBonus += Number(e.amountBonus)
                  this.form.exitShareRatio += Number(e.exitShareRatio)
                  this.form.amountDistribution += Number(e.amountDistribution)
                })
              }
            },
            deep: true
          }
        },
        created() {
            this.getDicts('distribution_mode').then(response => {
                this.distributionTypeOptions = response.data
            })
            this.getDicts('currency').then(response => {
                this.currencyOptions = response.data
            })
            this.getDicts('exit_mode').then(response => {
                this.exitModeOptions = response.data
            })
            listDealExit({ 'dealId': this.$route.query.id }).then(response => {
              this.exitList = response.rows
            })
            this.$bus.$emit('async_done')
        },
        methods: {
            // 初始化数据
            init(data) {
              this.loading = true
              if (data != null && data.id !== undefined) {
                    getDealDistribution(data.id).then(response => {
                        this.form = response.data
                        this.distributionTypeChange(this.form.distributionType)
                        getDistributionDetails(this.form.id).then(response => {
                          this.form.dealDistributionDetailsList = response.rows
                          this.loading = false
                        })
                    })
                } else {
                    this.distributionTypeChange('')
                    getInvestment(this.$route.query.id).then(response => {
                      this.form.dealDistributionDetailsList = response.data
                      this.loading = false
                    })
                }
            },

          // 根据选择回款类型的值来决定是否显示关联退出
          distributionTypeChange(val) {
            if (val === 'exit_collection') {
              this.isShowJoinExit = true
            } else {
              this.isShowJoinExit = false
              this.form.joinExit = undefined
            }
          },
          exitModeFormat(row) {
            return this.selectDictLabel(this.exitModeOptions, row.exitMode)
          },
          distributionTypeFormat(distributionType) {
            return this.selectDictLabel(this.distributionTypeOptions, distributionType)
          }
        }
    }
</script>
